Center and Fit Image the Right Way

I wanted a defacto way to center an image. Looks like I found a decent way

picture {
  overflow: auto;
  display: grid;
  grid-template-rows: minmax(0,1fr) auto;
  resize: both;
  border: 2px solid red;
}

picture img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: 50% 0;
}

<picture style="width:100px;height:170px;">
  <img src="https://www.williamusic.com/wp-content/uploads/2021/07/WM_Logo4.png">
  
  <figcaption>myText caption</figcaption>
</picture>

Credits